票据|都会_微信开发小结——积累与沉淀

篇首语：本文由编程笔记#小编为大家整理，主要介绍了微信开发小结——积累与沉淀相关的知识，希望对你有一定的参考价值。

前言

微信开发是个人、企业或组织在拥有超大用户群体的微信应用上&＃xff0c;利用微信公众平台&＃xff0c;开发类似插件或服务的轻应用。微信公众平台分为三种&＃xff1a;订阅号&＃xff1a;主要面向媒体和个人&＃xff0c;旨在为用户提供信息资讯&＃xff0c;每天能够群发1条消息&＃xff0c;通过微信认证&＃xff0c;可获得菜单、获得用户信息等接口权限&＃xff1b;服务号&＃xff1a;主要面向企业、政府和组织&＃xff0c;旨在为用户提供服务&＃xff0c;每月能够群发4条消息&＃xff0c;通过微信认证&＃xff0c;可获得高级接口权限&＃xff1b;企业号&＃xff1a;主要面向企业&＃xff0c;旨在为企业用户提供移动端办公&＃xff0c;只有企业通讯录中的用户才能关注使用&＃xff0c;可以自由推送消息&＃xff0c;不受限制&＃xff0c;保密消息&＃xff0c;防转发。期间我负责开发了基于服务号的微信投票和基于企业号的微信ERP&＃xff0c;以下我主要从开发的角度介绍期间遇到的问题和心得体会。

前提准备

1、微信公众号申请&＃xff0c;并通过微信认证。

2、准备一个二级以上域名&＃xff0c;域名必须要备案。

3、对于需要自定义开发&＃xff0c;需要提供可以部署程序的公网服务器。

对于2、3点&＃xff0c;可以由开发公司提供&＃xff0c;只需提供客户方一个管理后台地址和管理员账号密码&＃xff0c;由客户方管理人员进行维护。

开发者认证获取票据

无论何种公众平台&＃xff0c;开发者第一步工作是&＃xff0c;获取AccessToken票据&＃xff0c;因为绝大部分调用接口时都需携带AccessToken票据。AccessToken需要用申请的公众平台提供的CorpID和Secret&＃xff08;服务号则用AppID和Secret&＃xff09;来换取&＃xff0c;不同的Secret会返回不同的AccessToken&＃xff0c;换取的过程就是一次接口的调用。每次获取的AccessToken有效期是2个小时&＃xff0c;失效后需要重新换取&＃xff0c;我利用缓存处理把每次获取的AccessToken保存起来&＃xff0c;设置7100秒&＃xff0c;防止临界值的情况&＃xff0c;并把它设置成静态属性&＃xff0c;封装获取过程。在每次调用微信接口时&＃xff0c;直接校验是否失效。

static string AccessToken get return qyUtils.GetTenket();
///


/// 应用toket获取
///


///
public static string GetTenket()

try

var cache &＃61; new mCache("token", "qyAccessToken");
if (cache.ValidCache()) return cache.GetCache().ToString();
string url &＃61; string.Format("0/cgi-bin/gettoken", Globals.QY_HTTP);
StringBuilder param &＃61; new StringBuilder();
param.Append("corpid&＃61;");
param.Append(Globals.CORP_ID);
param.Append("&corpsecret&＃61;");
param.Append(Globals.CORP_SECRET);
string strValue &＃61; Utils.GetData(url, param.ToString());
ACCESS_TOKEN ac_token &＃61; JsonConvert.DeserializeObject(strValue);
if (ac_token.errcode &＃61;&＃61; ReturnCode.请求成功)

cache.ExpireTime &＃61; 7100;
cache.SetCache(ac_token.access_token);
return ac_token.access_token;

else

HttpContext.Current.Response.Write("");
return null;


catch
return null;



接口封装

工欲善其事必先利其器&＃xff01;微信提供的API接口都是HTTP的POST请求和Get请求&＃xff0c;我们可以封装成工具类&＃xff0c;方面后期的使用。对于Get请求&＃xff0c;我把URL变量作为参数传入发送
HttpWebRequest请求&＃xff0c;获取
HttpWebResponse响应&＃xff0c;反序列化结果判断请求是否成功&＃xff0c;对于Post请求也差不多&＃xff0c;只是多加一个传入数据的参数变量。

public static string PostData(string url, string data)

data &＃61; Regex.Unescape(data);
string json &＃61; HttpPost(url, data);
try

var item &＃61; JsonConvert.DeserializeObject(json);
if (item.errcode !&＃61; 0)

if (item.errcode &＃61;&＃61; ReturnCode.获取access_token时AppSecret错误或者access_token无效 || item.errcode &＃61;&＃61; ReturnCode.oauth_code超时)
ClearTenket();
item.errmsg &＃61; item.errcode.ToString();
json &＃61; JsonConvert.SerializeObject(item);


catch
return json;

公众号经常有需要用到一些临时性的多媒体素材的场景&＃xff0c;是通过media_id来进行的&＃xff0c;而对于上传文件的POST请求&＃xff0c;我直接使用的.NET语言自带的
WebClient进行处理&＃xff0c;先将文件上传到自己服务器端&＃xff0c;使用相对路径获取服务器上的文件资源&＃xff0c;调用微信公众号API&＃xff0c;上传文件&＃xff0c;返回媒体文件唯一标识。

public static QyUploadTemp WeChatUpload(string url, string type)

try

if (!string.IsNullOrEmpty(qyUtils.GetTenket()))

string posturl &＃61; string.Format("0/cgi-bin/media/upload?access_token&＃61;1&type&＃61;2", Globals.QY_HTTP, AccessToken, type);
System.Net.WebClient webclient &＃61; new System.Net.WebClient();
string media &＃61; HttpContext.Current.Server.MapPath(url);
byte[] be &＃61; webclient.UploadFile(new Uri(String.Format(posturl, AccessToken, type)), media);
string content &＃61; Encoding.Default.GetString(be);
var result &＃61; JsonConvert.DeserializeObject(content);
if (result.errcode &＃61;&＃61; ReturnCode_QY.请求成功)
return result;


catch
return null;



身份验证

微信应用经常需要获取用户身份信息&＃xff0c;这就需要通过OAuth2.0验证接口。利用.NET应用的FormsAuthentication机制&＃xff0c;判断请求是否已经过身份验证&＃xff0c;否则跳转统一的授权认证处理/OAuth/QyLogOn调用OAuth验证接口获取code&＃xff0c;这里需要指定成功获取code之后&＃xff0c;根据code获取成员信息&＃xff0c;并记录用户信息&＃xff0c;身份验证处理。将需获取用户身份信息的方法继承基类QyBaseController&＃xff0c;就可以在每次获取用户身份前&＃xff0c;先OAuth验证&＃xff0c;如果已经过身份验证&＃xff0c;则无需重复身份验证。

1、未通过身份验证处理
public ActionResult QyLogOn(string returnUrl)

if (!String.IsNullOrEmpty(returnUrl))

Session["WX_returnUrl"] &＃61; returnUrl;

string action &＃61; "OAuth/QyLogOnOAuth";
return Redirect(Utils.GetAuthorizeUrl(Globals.CORP_ID, action, "", OAuthScope.snsapi_base));

2、调用OAuth验证接口获取code&＃xff0c;这里主要特别注意的是redirectUrl必须保证和浏览器中的地址一致
public static string GetAuthorizeUrl(string appId, string action, string state, OAuthScope scope, string responseType &＃61; "code")

string redirectUrl &＃61; HttpUtility.UrlEncode(string.Format("0/1", Globals.DOMAIN_URL, action));
string url &＃61;
string.Format("https://open.weixin.qq.com/connect/oauth2/authorize?appid&＃61;0&redirect_uri&＃61;1&response_type&＃61;2&scope&＃61;3&state&＃61;4#wechat_redirect",
appId, redirectUrl, responseType, scope, state);
return url;

3、根据code获取成员信息&＃xff0c;并记录用户信息&＃xff0c;身份验证处理
public ActionResult QyLogOnOAuth(string code, string state)

if (string.IsNullOrEmpty(code)) return Content("您拒绝了授权&＃xff01;");
try

//通过&＃xff0c;用code获取成员信息
OAuthUserInfoResult result &＃61; qyUtils.GetUserInfobyCode(code);
if (string.IsNullOrEmpty(result.UserId))
return Content("

");
var user &＃61; qyUtils.GetUserInfobyUserId(result.UserId);
qyWxUser.LogOn(user);
if (Session["WX_returnUrl"] !&＃61; null) return Redirect(Session["WX_returnUrl"].ToString());

catch (Exception ex)

return Content(ex.Message);

return RedirectToAction("ErrorTip", "Account");



微信端UI框架

由于之前缺乏移动端开发经验&＃xff0c;对于前端框架都不熟悉&＃xff0c;只能网上了解一些开源的UI框架&＃xff0c;又因为自己毕竟不是专业的前端开发工程师&＃xff0c;最佳的选择是自带功能丰富组件的开源UI库。经过筛选&＃xff0c;最先尝试的是由微信官方的推的weui&＃xff0c;发现只有一些简单的组件&＃xff0c;对于js请求处理响应都得自己写&＃xff0c;便放弃了。后来了解到由阿里巴巴基于Framework7开发的SUI库&＃xff0c;轻量、精美&＃xff0c;实现了下拉刷新、日历、省市区选择器等功能非常强大的组件。这种资源对于一个只是刚刚入门的前端开发来说&＃xff0c;无疑是最好的。但却忽略了很重要的一点&＃xff0c;对于这种开源项目来说&＃xff0c;团队的的持续维护更新&＃xff0c;是至关重要的。随着使用频率增加&＃xff0c;以及业务要求的复杂&＃xff0c;SUI框架中隐藏的问题渐渐暴露出来&＃xff1a;路由跳转页面和路由返回上一个页面存在问题&＃xff0c;下拉滚动加载数据不能与上拉刷新并存&＃xff0c;android 端微信显示效果比ios端微信差&＃xff0c;日历组件初次打开不会聚焦输入框里的时间&＃xff1b;这套UI库是引用Zepto.js&＃xff0c;再引用Jquery库&＃xff0c;会出现冲突以致组件失效、不稳定&＃xff0c;而且SUI的主力开发人员已离开阿里巴巴&＃xff0c;没有人继续负责维护这个项目了。后来了解到SUI框架的作者另外开了一个新的项目Light7&＃xff0c;相当于SUI的升级版&＃xff0c;修复了很多bug&＃xff0c;还扩展了一些新的功能&＃xff0c;而且会长期维护更新&＃xff0c;于是又切换新的UI库。

这次前端UI框架的选择&＃xff0c;给我最大的体会是项目风险管理&＃xff0c;在开发过程中引入新技术&＃xff0c;不可避免地要遇到各种风险。对于新技术开发&＃xff0c;在项目开发早期&＃xff0c;就应该建立系统的架构&＃xff0c;解决关键技术难题、开发的基础构件&＃xff0c;对所需要应用的技术做深度探索。越是技术复杂度高的项目&＃xff0c;就越应该早地处理技术难题。新技术开发是探索性很强的工作&＃xff0c;潜在着许多失败的风险&＃xff0c;在可行性分析阶段&＃xff0c;要广泛搜集相关信息&＃xff0c;设计多种可行方案&＃xff0c;进行充分论证。如果针对新技术&＃xff0c;没有经验可借鉴&＃xff0c;探索过程中要充分利用互联网资源&＃xff0c;学习同行经验&＃xff0c;往往事半功倍。

用户体验

微信端开发类似一个App软件应用&＃xff0c;页面数据渲染速度对用户体验是至关重要的&＃xff0c;微信端数据加载采用的是Juicer模板渲染的方式&＃xff0c;高效、轻量的前端 (Javascript) 模板引擎&＃xff0c;当用户进行滚动加载或者下拉刷新时&＃xff0c;体验很流畅。对于ASP.NET MVC程序&＃xff0c;需要解决一个符号的冲突&＃xff0c;把&＃64;符号换成&&＃xff0c;然后把后端处理得到的数据封装成指定的JSON格式&＃xff0c;绑定模板即可。模板的定义&＃xff08;注&＃xff1a;这里的"&"符号使用必须修改juicer.js中的"&＃64;"&＃xff09;&＃xff1a;


封装JS调用&＃xff0c;以参数的形式指定渲染的模板ID和数据&＃xff0c;统一处理渲染数据的判断过程&＃xff0c;降低代码冗余&＃xff1a;
initTpl &＃61; function (e, t, n)
n || (n &＃61; !1),
"feed_list" !&＃61; e || t.showDing || 0 &＃61;&＃61; t.showDing || (t.showDing &＃61; !0);
var i &＃61; $("#" &＃43; e).html(),
a &＃61; juicer(i),
o &＃61; a.render(t);
console.log(t);
return t.page && !n && t.total > t.page * t.count && null !&＃61; t.data && t.data.length > 0 && !n && (o &＃43;&＃61; loadMoreHtml),
o
调用方法就是&＃xff1a;
list &＃61; JSON.parse(e);
$("#popup-info").find("#inventoryview").html(initTpl("morder_li_head ", list));


管理后台

当申请微信公众号&＃xff0c;都会有一个相应的微信管理登陆后台&＃xff0c;但是&＃xff0c;对于微信端很多自定义功能&＃xff0c;需要管理后台进行统一的管理&＃xff0c;比如&＃xff1a;微信投票项目的发起&＃xff0c;参与公司的审核&＃xff0c;投票数据统计&＃xff0c;ERP用户与微信账号的对应关系&＃xff0c;ERP菜单权限分配。数据处理采用的优秀的开源项目jQuery MiniUI&＃xff0c;丰富的UI控件、高度的稳定性、强大的扩展能力和平滑的版本升级能力。

集成的功能&＃xff1a;系统管理里添加了登陆用户角色和权限管理&＃xff0c;指定不同用户类型不同的功能&＃xff0c;最高管理员权限用户可以管理多个微信公众号&＃xff08;这一点仍在开发中...&＃xff09;&＃xff0c;只需开放企业管理员账户给相应客户即可。管理后台添加了日志管理功能&＃xff0c;做到错误记录&＃xff0c;方便管理员跟踪。对于微信ERP主要是企业号应用管理&＃xff0c;微信端ERP菜单管理&＃xff0c;微信用户添加、修改和关联ERP用户&＃xff0c;分配ERP菜单权限&＃xff0c;以及指定微信用户发送文本、图文、图片、文件、视频、语音消息。

注&＃xff1a;后续我还会针对应用的技术进行拆分讲解记录&＃xff0c;主要是给自己做一个积累&＃xff0c;也供大家学习参考&＃xff0c;少走弯路。